*{
    margin:0px;
    padding:0px;
}

html,body{
    height:100%;
    width:100%;
}
body{
    background: url("../../img/loginbackage.jpg") no-repeat 100% 100%;
}
@keyframes shows {
    from{
        opacity:0;
    }
    to{
        opacity: 1;
    }
}
.content{
    width:100%;
    position:relative;
}
#receiverDiv{
    height:90%;
}
#receiverDiv::-webkit-scrollbar{
    width:2px;
}
#receiverDiv::-webkit-scrollbar-thumb{
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
    background: #535353;
}
.messageBanner{
    width:20%;
    height:850px;
    position: absolute;
    right:10px;
    top:0px;
}
.operation{
    height:15%;
    width:100%;
    position: absolute;
    right:0px;
    bottom:30px;
}

#top {
    box-shadow: 0px 0px 5px 0px #0f0f0f;
    background:#FFF;
}

#top div{
    width:95%;
    margin:auto;
}

.message{
    animation:shows 0.5s ;
}

#sendDiv{
    height:100px !important;
    margin-bottom: 10px;
}

.status{
    height:10px;
    width:10px;
    background:#cccccc;
    display:inline-block;
    border-radius: 10px;
}

.icon{
    height: 50px;
    width:50px;
}

.messageContnet{
    max-height:700px;
}
.sendMessageBt{
   display: inline-block;
    height:22px;
    line-height:20px;
    cursor:pointer;
    position:absolute;
    right:15px;
}

.messageValue{
    width:100%;
    height:200px;
    border:1px solid #e5e5e5;
}

.select{
    width:20%;
    margin-bottom: 10px;
}